<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
	div{
		padding:10px;
	}
	#div1{
		background-color: #00f;
		color:#fff;
		font-size: larger;
		position: absolute;
		width: 400px;
		height: 200px;
		left: 100px;
		top: 100px;
	}
	

</style>
<script>
	
	var fixIE=function(e)
	{
		if(!e){
			e = window.event;
		}
		
		e.target = e.srElement;
		e.pageX = e.clientX;
		e.pageY = e.clientY;
		e.layerX = e.offsetX;
		e.layerY = e.offsetY;
		return e;
	}
	window.onload = function(e){
		var elem = document.getElementById("div1");
		
		document.onclick=function(e){
			var event = e||window.event;
			//alert(event.pageX+","+event.pageY); ie=pagex,pagey값 없음.
			//alert(event.clientX+","+event.clientY);
			
			console.log("clientX:"+event.clientX+",clientY:"+event.clientY);  //mozila, ie 공통적용
			//console.log("pageX:"+event.pageX+",pageY:"+event.pageY);
			console.log("screenX:"+event.screenX+",screenY:"+event.screenY);			
		}
		elem.onclick = function(e){
			var event = fixIE(e);
		
			
			console.log("layerX:"+event.layerX+",layerY:"+event.layerY);
		}
	}
</script>
</head>
<body>
 <div id="div1">Now is the time for all good wo-men to come to the aid of their country.</div>
</body>
</html>